<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="bootcss/css/bootstrap.min.css">
    <script src="js/jquery.js"></script>
    <script src="bootcss/js/bootstrap.min.js"></script>
    <style type="text/css">
    #header {
        height: 40px;
        width: 100%;
    }
    #left {
      display:block;
      position:absolute;
      top:66px;
      width:212px;
      left:0px;
      bottom:0px;
      z-index:7;
    }
    #right {
      display:block;
      position:absolute;
      right:0px;
      top:66px;
      bottom:0px;
      z-index:7;
      left:212px;
      padding-top:5px;
    }
    iframe {
      width:99.69%;
      height:98.9%;
      border-top:none;
      overflow-y:scroll;
      -webkit-overflow-scrolling:touch;
      border:none;
      position: absolute;
      bottom: 0;
    }

    </style>
</head>
<body>
    <div id="header">
        
    </div>
    <div id="content">
        <div id="left">
            <iframe src="menu.html" id="leftFrame"></iframe>
        </div>
        <div id="right">
            <iframe src="index.html" id="rightFrame"></iframe>
        </div>
    </div>
</body>
</html>